const path = require('path')
const {merge}= require('webpack-merge') // 用来合并 
const common = require('./webpack.common')  // 引用公共组件
const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = merge(common, {
    mode: 'development',
    devtool: "inline-source-map", //  编译出来的文件可读 生成一个 DataUrl 形式的 文件.
    entry: './src/main.js',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename:'main.js'
    },
    plugins: [
        new HtmlWebpackPlugin({
          filename: 'index.html',
          template: 'src/index.html',
          minify: {
            collapseWhitespace: true,   // 清除html中的空格和换行符
            removeComments: true, // 清除注释
            removeRedundantAttributes: true,
            removeScriptTypeAttributes: true,  // 清除scrip标签中的type属性
            removeStyleLinkTypeAttributes: true, // 清除style和 link的标签中的type属性
            useShortDoctype: true
          }
        })
  ],
  devServer: {
    open: false,   //在DevServer第一次构建完成时，自动用浏览器打开网页
    hot: true,  // 热替换 不刷新整个页面的情况下通过用新模块替换老模块来实现实时预览
    contentBase: './dist',
    port: '8001', // 端口号
    host: 'localhost', //配置DevServer服务器监听的地址。
    inline: true
  }
})